<template>
	<view>
		<view class="header">
			<view class="font34 colorfff">评价成功~</view>
			<view class="font28 colorfff marginTop15">感谢您的评价，您的评价会帮助更多顾客</view>
			<view class="watch marginTop30" @click="navTo('rateDetail')">查看评价</view>
		</view>
		<!-- <view class="content">
			<view class="tip-title">
				还有这些订单待评价哦～
			</view>
			<view class="goods-section">
				<view class="g-header ">
					<image class="logo" src="../../../static/home/order/store.png" mode="widthFix"></image>
					<text class="name">西城小店铺</text>
					<text class="yticon icon-you"></text>
				</view>
				<view class="g-item">
					<image src="https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=1620020012,789258862&fm=26&gp=0.jpg"></image>
					<view class="right">
						<text class="title clamp">韩版于是洞洞拖鞋 夏季浴室防滑简约居家【新人专享，限选意见】</text>
						<text class="spec">春装款 L</text>
						<view class="price-box">
							<text class="price">￥17.8</text>
							<text class="num">x1</text>
						</view>
					</view>
				</view>
				<view class="rate">
					<view class="rate-btn">
						去评价
					</view>
				</view>
			</view>
		</view> -->
		<view class="null">
			<view class="font40 colorfont">真棒！订单已经全部评价完啦～</view>
			<image src="../../../static/home/order/rateDetail.png" mode="widthFix"></image>
			<view class="font28 color999 textCenter">
				评价完啦，快去商城逛逛吧～
			</view>
			<view class="go-home" @click="navTo('index')">
				前往商城首页
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				options:{}
			}
		},
		onLoad(options) {
			console.log(options)
			this.options=options
		},
		methods: {
			navTo(url){
				if(url=='index'){
					uni.navigateTo({
						url:'../../index/index'
					})
				}else{
					this.$Router.push({
						name:url,
						params:{
							cid:this.options.cid,
							goodsId:this.options.goodsId,
							orderId:this.options.orderId
						}
					});
				}
				
			},
		}
	}
</script>

<style lang="scss">
	page{
		background-color: #F5F5FA;
	}
	.header{
		height: 370upx;
		width: 100%;
		background-color: #FF5E00;
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		.watch{
			width:170upx;
			height:52upx;
			line-height: 52upx;
			text-align: center;
			background:rgba(255,255,255,1);
			border-radius:30upx;
			font-size: 28upx;
			color: #FF5E00;
		}
	}
	.null{
		padding: 60upx 30upx;
		image{
			width: 440upx;
			height: auto;
			margin: 90upx auto 0;
			display: block;
		}
		.go-home{
			margin: 70upx auto 0;
			width:268upx;
			height:72upx;
			line-height: 72upx;
			text-align: center;
			background:linear-gradient(90deg,rgba(255,94,0,1) 0%,rgba(255,35,0,1) 100%);
			box-shadow:0px 10upx 30upx rgba(255,68,0,0.2);
			border-radius:36upx;
			color: #fff;
			font-size: 28upx;
		}
	}
	.content{
		position: relative;
		width: 100%;
		.tip-title{
			color: #0B0E11;
			font-size: 40upx;
			margin: 60upx 0 30upx 30upx;
		}
		.goods-section {
			margin-top: 10upx;
			background: #fff;
		
			.g-header {
				display: flex;
				align-items: center;
				height: 84upx;
				padding: 0 30upx;
				position: relative;
			}
		
			.logo {
				display: block;
				width: 36upx;
				height: auto;
			}
		
			.icon-you {
				font-size: 32upx;
				color: $font-color-light;
				margin-left: 10upx;
				position: relative;
				top: 4upx;
			}
		
			.name {
				font-size: 30upx;
				color: $font-color-base;
				margin-left: 24upx;
			}
		
			.g-item {
				display: flex;
				padding: 20upx 30upx;
		
				image {
					flex-shrink: 0;
					display: block;
					width: 180upx;
					height: 180upx;
					border-radius: 20upx;
				}
		
				.right {
					flex: 1;
					padding-left: 24upx;
					overflow: hidden;
				}
		
				.title {
					font-size: 30upx;
					color: $font-color-dark;
				}
		
				.spec {
					font-size: 26upx;
					color: $font-color-light;
				}
		
				.price-box {
					display: flex;
					align-items: center;
					font-size: 32upx;
					color: $font-color-dark;
					padding-top: 40upx;
		
					.price {
						margin-bottom: 4upx;
						color: #0B0E11;
						font-size: 28upx;
					}
		
					.num {
						width: 60upx;
						height: 40upx;
						text-align: center;
						line-height: 40upx;
						display: inline-block;
						color: #8E8E93;
						font-size: 24upx;
						margin-left: 10upx;
					}
		
					.cancle-price {
						height: 50upx;
						line-height: 50upx;
						padding: 0 35upx;
						display: inline-block;
						font-size: 24upx;
						color: #0B0E11;
						border-radius: 60upx;
						border: 1upx solid #707070;
					}
				}
		
				.step-box {
					position: relative;
				}
			}
			.rate{
				display: flex;
				justify-content: flex-end;
				padding: 30upx;
				.rate-btn{
					width: 154upx;
					height: 56upx;
					line-height: 56upx;
					text-align: center;
					border: 1upx solid #FF5D00;
					color: #FF5D00;
					font-size: 28upx;
					border-radius: 40upx;
				}
			}
		}
	}
	
</style>
